<!--
  功能：
  作者：jiraiya_chen
  时间：2024年01月17日 16:13:40
  修改人员：jiraiya_chen
-->
<template>
  <div class="btn-box">
    <el-upload
      action="#"
      :on-change="handleChange"
      :show-file-list="false"
      accept=".xml,.bpmn,.svg"
      :auto-upload="false"
    >
      <el-button type="primary" plain>导入</el-button>
    </el-upload>
    <el-dropdown @command="onCommand" :hide-on-click="false">
      <el-button type="primary" plain>
        导出
        <i class="el-icon-arrow-down el-icon--right"></i>
      </el-button>
      <el-dropdown-menu slot="dropdown">
        <el-dropdown-item command="saveBPMN">保存为BPMN</el-dropdown-item>
        <el-dropdown-item command="saveSVG">保存为SVG</el-dropdown-item>
      </el-dropdown-menu>
    </el-dropdown>
  </div>
</template>

<script>
export default {
  name: "",
  props: [],

  components: {},
  data() {
    return {};
  },
  methods: {
    onCommand(type) {
      this.$emit("on-export", type);
    },
    handleChange(file) {
      let that = this;
      // 转换成bpmn数据
      var reader = new FileReader();
      reader.readAsText(file.raw);
      reader.onload = function (res) {
        that.$emit("upload-file-res", res.target.result);
      };
    },
  },
  mounted() {},
  watch: {},
  computed: {},
  filters: {},
  beforeDestroy() {},
};
</script>

<style scoped lang="scss">
.btn-box {
  display: flex;
  gap: 20px;
}
</style>
